<style>

#back_btn {
  width: 75px!important;
  height: 45px!important;
}
#photo_number {
  width: 50px;
}
#prev_btn {
  width: 80px!important;
  height: 45px!important;
}
.play_btn {
  width: 130px!important;
  height: 27px!important;
}
#next_btn {
  width: 80px!important;
  height: 45px!important; 
}

.menu_back {
  position: absolute;
  right: 40%;
  vertical-align: baseline;
  height: 52px;
  z-index: 12;
  margin-top: 3px;
}

.td1{width: 50%;height: 100%;}
.td2{width: 350px;}
.left{position: relative;width: 100%;height: 100%;}
.left_top{position: absolute;right: 0;top: 0;}
.number_td {
  width: 100px;
  white-space: nowrap;
  font-weight: bold;
  font-size: 15px;
  font-style: italic;
  text-align: left;
}
#span_number {
  width: 100px;
}
.back_td {
  padding-right: 100px;
}
.prev_td {
  padding-right: 20px;
}
.play_td {
  padding: 0 20px;
}
.next_td {
  padding-left: 20px;
}
</style>


<table cellpadding=0 cellspacing=0 width=100% height=100% >
  <tr>
    <td class="td1">
      <div class="left">
      <div class="left_top">
        <table cellpadding=0 cellspacing=0 width=100% height=100% ><tr>
          <td class="back_td"><a href="gallery.php"><img id = "back_btn" src="gallery/back_btn.png"></img></a></td>
          <td class="number_td"><p id="span_number"></p></td>
        </table>
      </div>
      </div>
    </td>
    <td class="td2">
      <table cellpadding=0 cellspacing=0>
        <tr>
          <td class="prev_td"><img id = "prev_btn" src="gallery/prev_btn.png" style="cursor: pointer"></img></td>
	        <td class="play_td"><img id = "play_btn" src="gallery/play_btn.png" style="cursor: pointer" name="play"></img></td>
	        <td class="next_td"><img id = "next_btn" src="gallery/next_btn.png" style="cursor: pointer"></img></td>
        </tr>
      </table>
    </td>
    <td class="td1">&nbsp;&nbsp;</td>
  </tr>
</table>
